import {
  createRouter,
  createWebHashHistory,
  createWebHistory,
} from 'vue-router';

import { useAccessStore, useUserStore } from '@vben/stores';

import { useAuthStore } from '#/store';

import { generateAccess } from './access';
import { createRouterGuard } from './guard';
import { accessRoutes, routes } from './routes';
/**
 *  @zh_CN 创建vue-router实例
 */
const router = createRouter({
  history:
    import.meta.env.VITE_ROUTER_HISTORY === 'hash'
      ? createWebHashHistory(import.meta.env.VITE_BASE)
      : createWebHistory(import.meta.env.VITE_BASE),
  // 应该添加到路由的初始路由列表。
  routes,
  scrollBehavior: (to, _from, savedPosition) => {
    if (savedPosition) {
      return savedPosition;
    }
    return to.hash ? { behavior: 'smooth', el: to.hash } : { left: 0, top: 0 };
  },
  // 是否应该禁止尾部斜杠。
  // strict: true,
});

/** 重置路由 */
const resetRoutes = async () => {
  const accessStore = useAccessStore();
  const userStore = useUserStore();
  const authStore = useAuthStore();
  // 生成路由表
  // 当前登录用户拥有的角色标识列表
  const userInfo = userStore.userInfo || (await authStore.fetchUserInfo());
  const userRoles = userInfo?.roles ?? [];

  // 生成菜单和路由
  const { accessibleMenus, accessibleRoutes } = await generateAccess({
    roles: userRoles,
    router,
    // 则会在菜单中显示，但是访问会被重定向到403
    routes: accessRoutes,
  });
  // 保存菜单信息和路由信息
  accessStore.setAccessMenus(accessibleMenus);
  accessStore.setAccessRoutes(accessibleRoutes);
  accessStore.setIsAccessChecked(true);
};

// 创建路由守卫
createRouterGuard(router);

export { resetRoutes, router };
